<template>
  <div id="app">
    <!-- 操作結果提示 -->
    <msg v-if="errorShow" class="done-msg error-msg-dialog" icon="warn">
      <template slot="description">
        <p class="title">登录失败！</p>
        <p>请求登录时发生错误，请重新尝试！</p>
      </template>
    </msg>
    <template v-else>
      <my-header></my-header>
      <transition :name="transitionName">
        <keep-alive class="child-view">
          <router-view class="child-view" v-if="$route.meta.keepAlive"></router-view>
          <router-view class="child-view" v-if="!$route.meta.keepAlive" :key="'time'+new Date().getTime()" ref="myApp"></router-view>
        </keep-alive>
      </transition>
      <my-bottom-normal v-if="$route.meta.bottomType === 'bottom-normal'"></my-bottom-normal>
    </template>
  </div>
</template>

<script>
  import '@/assets/js/loadRem.js';
  import Header from '@/components/Header/';
  import BottomNormal from '@/components/Bottom/BottomNormal.vue';
  import { Msg } from 'vux';
  export default {
    name: 'app',
    components: {
      'my-header': Header,
      'my-bottom-normal': BottomNormal,
      Msg
    },
    data () {
      return {
        transitionName: 'slide-right',
        initPromise: '',
        errorShow: false,
      };
    },
    created () {
      // 显示;
      this.$vux.loading.show({
        text: '登陆中...'
      });
      this.initPromise = this.appInit();
    },
    watch: {
      // 转场动画
      '$route' (to, from) {
        const toDepth = to.path.split('/').length;
        const fromDepth = from.path.split('/').length;
        let animateType = this.$route.meta.animateType;
        if (animateType && from.name !== 'InitiateApplication' && from.name.indexOf('Detail') === -1) {
          this.transitionName = animateType;
        } else {
          this.transitionName = toDepth < fromDepth ? 'slide-left' : 'slide-right';
        }
      }
    },
    methods: {
      appInit: async function () {
        let requestUrl = localStorage.getItem('requestUrl');
        if (requestUrl != null) {
          this.axios.defaults.baseURL = requestUrl;
        }
        await this.getRequestUrl();
        this.setTypeKeyValue();

        function toGetUserInfo(that){
          let userInfo = that.getUserInfo()
          if(userInfo && that.$refs.myApp.$refs.menu){
            that.$refs.myApp.$refs.menu.userInfo = userInfo;
          }
        }
        
        await this.setUserInfo(this,toGetUserInfo);
      }
    }
  };
</script>

<style lang="less">
  @import '~vux/src/styles/reset.less';
  @import '~vux/src/styles/1px.less';
  @import "./assets/style/theme";
</style>
<style lang="scss">
  @import "./assets/style/global";
  .error-msg-dialog{
    position: absolute;
    width: 100%;
  }
</style>
